.xdh-map-draw-panel{
  box-sizing: border-box;
  padding: 5px;
  * {
    box-sizing: border-box;
  }
  .type-btns-warp{
    // width: 200px;
    .button{
      width: 50px;
      border: 1px solid transparent;
      float: left;
      cursor: pointer;
      .icon{
        display: block;
        margin: 2px auto;
      }
      .name{
        font-size: 12px;
        line-height: 2;
        width: 100%;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      &:hover{
        border: 1px solid skyblue;
      }
    }
  }
  .tools-btns-warp{
    margin-top: 5px;
    border-top: 1px solid #C5C4C1;
  
    .button{
      float: left; 
      padding: 3px 5px;
      border-radius: 3px;
      border: 1px solid #C5C4C1;
      margin-top: 5px;
      font-size: 14px;
      margin-right: 8px;
      color: #C5C4C1;
      pointer-events: none;
      &.active{
        color: #818181;
        cursor: pointer;
        pointer-events: auto;
      }
    }
  }
  .style-btns-warp{
    display: block;
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    margin-top: 5px;
    border-top: 1px solid #C5C4C1;
    .color-input-item{
      flex: 0 0 150px;
      width: 150px;
      display: flex;
      flex-flow: row nowrap;
      align-items: center;
      font-size: 12px;
      margin: 3px;
      .color-select{
        appearance: normal;
        width: 24px;
        height:24px;
        padding: 0;
        border: 0; 
        outline:none; 
      }
      .num-select{
        line-height: 1;
        height: 20px;
        width: 36px;
        text-align: center;

      }
      .num-btn{
        display: block;
        width: 16px;
        height: 16px;
        text-align: center;
        line-height: 12px;
        font-size:16px;
        font-style: normal;
        border-radius: 50%;
        margin: 0 2px;
        border: 1px solid skyblue;
        color: skyblue; 
        cursor: pointer;
      }
      
    }
  }
} 
::-webkit-color-swatch-wrapper{
  background-color:white;
}
::-webkit-color-swatch{
  position: relative;
}
// input::-webkit-outer-spin-button,
// input::-webkit-inner-spin-button {
//     -webkit-appearance: none;
// }